import React, { Component } from 'react';

class Listitem extends Component {
  render() {
    const { id, title, datetime, isDone, handleDone, handleDelete } = this.props
    return (
      <li key={id} className={ isDone ? 'active': '' }>
        <h3>{title}</h3>
        <div className="right">
          <b>{datetime}</b>
          <span onClick={ () => handleDone(id) }>完成</span>
          <span onClick={ () => handleDelete(id) }>X</span>
        </div>
    </li>
    );
  }
}

export default Listitem;
